<link type="text/css" href="css/measure_it.css" rel="Stylesheet" />
<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>

<div id="loginframe" align="center">
	<form id='lf' method='post' action=''>
		Username<br /><input type="text" name="un" id="un" value="" /><br />
		Password<br /><input type="text" name="pw" id="pw" value="" />
		<input type="submit" value="Login" class="button" />
	</form>
</div>

<script type="text/javascript">
	$('#lf').submit(function(){
		$('#status_message').remove();
		$.post('php/measureit_functions.php', { 
				'do' : 'customer_login',
				'un' : $('#un').val(),
				'pw' : $('#pw').val()
			}, function(data) {
				if(data != '' && data != undefined && data != 'undefined'){				
					div_get('#loginframe', 'status_message', 'login successful', 'successbox');
					document.location = 'index.php?PHPSESSID='+data;
				}else{
					div_get('#loginframe', 'status_message', 'login failed', 'errorbox');
					exit;
				}
		});
		return false;
	});

	function div_get(parent,id,value,css){
		$(parent).append('<div id="'+id+'" class="'+css+'">'+value+'</div>');
	}
	
</script>